<link rel="stylesheet" href="/assets/css/layui.css">
<link rel="stylesheet" href="/assets/css/draggable.css">
<style>
    .layui-tree-entry {
        height: 22px !important;
    }

    .layui-tree-icon {
        width: 14px !important;
        height: 14px !important;
    }

    .layui-tree-iconClick {
        margin: 0 4px;
    }

    .layui-tree-iconClick .layui-icon.layui-icon-file {
        margin-left: -2px;
    }

    .selected {
        background-color: bisque;
    }

    p {
        line-height: 24px;
    }

    .left,.right{
        min-height: 500px;
        max-height:800px;
        overflow-y: auto;
    }
    .container .item {
        line-height: 24px;
    }
    .container .right span {
        display: block;
        width: 100%;
        height: 90%;
    }
</style>
<div class="row">
    <div class="col-xs-12 col-sm-6 col-md-2 col-lg-2">
        <div class="panel panel-default panel-intro">
            <div class="panel-body">
                <div id="1" class="tab-content">
                    <div class="tab-pane fade active in" id="one">
                        <div class="widget-body no-padding">
                            <div id="test4" class="demo-tree"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-xs-12 col-sm-6 col-md-10 col-lg-10">
        <div class="panel panel-default panel-intro">
            <div class="panel-body">
                <div id="myTabContent2" class="tab-content">
                    <div class="tab-pane fade active in" id="two">
                        <div class="widget-body no-padding">
                            <form id="course-form" class="form-horizontal form-ajax" action="/admin/course/classroom/add">
                                <div class="form-group">
                                    <label class="control-label col-xs-12 col-sm-2">{:__('选择学期')}:</label>
                                    <div class="col-xs-12 col-sm-10">
                                        <div class="form-inline">
                                            <select class="form-control semester" name="semester_id" style="width: 120px;">
                                            </select>
                                            <select class="form-control semester_num" name="semester_num">
                                            </select>
                                        </div>
                                    </div>
                                </div>

                                <div id="divcontainer" class="container">
                                    <div class="left" data-allowed="true">
                                    </div>
                                    <div class="right">
                                    </div>
                                </div>
                                <div class="row" style="margin-top: 20px; text-align: center">
                                    <div class="col-xs-12 col-sm-12">
                                        <input type="hidden" name="school_id" value="">
                                        <input type="hidden" name="class_id" value="">
                                        {if $auth->check('course/classroom/add') }
                                        <button type="submit" class="btn btn-success btn-embossed disabled">确定</button>
                                        {/if}
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script type="text/html" id="semesterTpl">
    <option value="0">请选择</option>
    <% for(var i=0; i< data.length; i++){ %>
    <option value="<%=data[i].id%>"><%=data[i].name%></option>
    <% } %>
</script>

<script type="text/html" id="teachersTpl">
    <% for(var i=0; i< teaches.length; i++){ %>
    <% var value = teaches[i]; %>
    <div draggable="true" class="color<%=value.num%> item">
        <%=value.subject_name%><br>
        <%=value.teacher_name%>
        <input type="hidden" name="" value="<%=value.id%>">
    </div>
    <% } %>
</script>

<script type="text/html" id="coursesTpl">
    <table>
        <colgroup>
            <col>
            <col>
            <col>
            <col>
            <col>
            <col>
            <col>
            <col>
        </colgroup>
        <thead>
        <tr>
            <td></td>
            <th>星期一</th>
            <th>星期二</th>
            <th>星期三</th>
            <th>星期四</th>
            <th>星期五</th>
            <th>星期六</th>
            <th>星期日</th>
        </tr>
        </thead>
        <tbody>

        <% for(var i=0; i< class_days.length; i++){ %>
        <% var value = class_days[i]; %>
        <tr>
            <th class="span"><%=i + 1%></th>
            <% for(j in value){ %>
                <td>
                    <% if(value[j]){ %>
                    <%=value[j].start_time%>-<%=value[j].end_time%>
                    <span data-allowed="true" data-index="<%=i + 1%>" data-day="<%=j%>">
                        <div draggable="true" class="color<%=value[j].num%> item">
                            <%=value[j].subject_name%><br>
                            <%=value[j].teacher_name%><br>
                            <input type="hidden" name="course[<%=i + 1%>][<%=j%>]" value="<%=value[j].teach_id%>">
                        </div>
                    </span>
                    <% } %>
                </td>
            <% } %>
        </tr>
        <% } %>
        </tbody>
    </table>


</script>

